<script type="text/javascript">
    jQuery.noConflict();
    function teste(e){
        if( jQuery(e).val() != 0 ){
            //Pega o id da categoria atual e envia junto
            valor = jQuery(e).attr("id").split("_")
            id = valor[1]
            jQuery.get("<?php echo site_url();?>admin/categorias_ajax/index/" + jQuery(e).val() + "/" + valor[1],
                {},
                function(dados){
                    //Remove qualquer outro label e seu conteudo que tiver a frente
                    //neste caso algum select jÃ¡ criado anteriormente de outra categoria
                    jQuery(e).parent().nextAll("label").remove();
                    //se dados retornados for diferente de 0 adicona ao fim os novos dados
                    if(dados != 0){
                        jQuery("#novasCategorias").append(dados);
                    }
                }
            )
        } else {
            //se desmarcou a categoria remove as subcategorias
            jQuery(e).parent().nextAll("label").remove()
        }
    }
</script>

<h1 class="compras_titulo_pagina"> <?php echo $titulo; ?></h1>

<div class="compras_frase"><?php echo $mensagem; ?></div>

<div class="compras_formulario">
<form action="<?php echo site_url("admin/categoria/gerenciar"); ?>" id="f_listagem" method="post">

    <div class="compras_categorias_select" id="novasCategorias">
        <label> <p>Categoria</p>
            <select name="categoria[]" id="categoria_1" onchange="teste(this)">
                <option value="0">-- Selecione --</option>
                <?php echo $categorias; ?>
            </select>
            <br clear="left" />
        </label>
    </div>
    <br clear="left" />

    <table width="525" cellspacing="0" border="0">
        <tr>
            <td width="80">
                <input type="image" name="editar"
                   onmouseover="this.src ='<?php echo site_url('images/botoes/editar_on.png'); ?>'"
                   onmouseout="this.src ='<?php echo site_url('images/botoes/editar.png'); ?>'"
                   src="<?php echo site_url()."images/botoes/editar.png";?>"
                   value ="1"
                />
             <td width="80">
                <input type="image" name="deletar"
                   onmouseover="this.src ='<?php echo site_url('images/botoes/deletar_on.png'); ?>'"
                   onmouseout="this.src ='<?php echo site_url('images/botoes/deletar.png'); ?>'"
                   src="<?php echo site_url()."images/botoes/deletar.png";?>"
                   value ="2"
                />
            <td align="right">
                <?php $img=array('src'=>"images/botoes/nova_categoria.png",
                'onMouseOver'=>"this.src ='".site_url('images/botoes/nova_categoria_on.png')."'",
                'onMouseOut'=>"this.src ='".site_url('images/botoes/nova_categoria.png')."'",
                "style"=>"border:0px;");
                echo anchor("admin/categoria/cadastrar", img($img)); ?>
           </td>
        </tr>
    </table>

</form>
</div>